<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

    <style>

        input:enabled {
            background: red;
        }

        input:disabled {
            background: #dddddd;
        }

        input:checked+label {
            color: blue;
}

input:required {
    border: solid 2px blue;
}

input:optional {
	background: #dcdcdc; 
	border: none;
}
input:valid {
    border: solid 1px green;
}

input:invalid {
    border: solid 3px red;
}
    </style>



<input type="text" disabled>
<input type="text" name="info">

<input type="radio" name="sex" checked id="boy">
<label for="boy">男</label>
<input type="radio" name="sex" checked id="girl">
<label for="girl">女</label>


<input type="text" name="title" required>
<input type="text" name="name">

<form accept="">
    <input type="email">
    <button>保存</button>
    </form>

</body>
</html>